HTMLEdit 3.0 Feature Overview

This page will give you a quick introduction to some of the features HTMLEdit offers.

Styles

With its support for cascading style sheets (CSS), HTMLEdit gives application developers full control over how much flexibility they want users to have when editing documents.

In some situations a developer might want to deliberately limit the design choices a user can make. He could, for example, define that the text in all paragraphs of a document should have the same size, color and font. The user editing the document can then focus on creating good content instead of worrying about or being able to tinker with a document’s design. This results in more productive authors creating sets of documents with a clear and consistent design.

In other situations the developer might want to loosen the reign and give his users as many design options as possible so that they can let their imagination take over.

Regardless of the level of flexibility the developer wants his users to have, HTMLEdit enables that with its support for CSS. The styles that are an integral part of CSS allow him to choose what paragraphs or lists should look like, which colors should be used, how much space should exist between words, between lines of text or between paragraphs, whether borders should exist, the size of margins and many other characteristics.

Custom Tags

HTMLEdit offers a feature called “custom tags”. This feature enables application developers to enrich documents semantically by extending them with custom “logical entities”. Some application developers store documents and images in databases and want their documents to contain database images and hyperlinks to other database documents. Other developers might want to include snippets of source code or Outlook contacts in their documents. Custom tags are a way to embed these kinds of logical entities as well as any other kind of entity a developer can come up with.

A common problem is to use database images in documents. To solve that problem one can use a custom tag that represents a database image. While a document is being loaded, the application translates the custom tag into an HTML image. After the document is edited, it is saved. While the document is being saved, the application translates the HTML image back into a custom tag. The back-and-forth translation is achieved through two component events that must be handled by the application.

Another example for the use of custom tags would be embedded source code. The application developer might want his users to be able to embed source code snippets into technical articles. To that end a custom tag can be used to represent a snippet of source code. The snippet could be symbolized in the form of a special image. The user can edit the snippet as source code (and not as HTML) in his favorite source code editor. This could have a number of benefits including proper indentation, syntax highlighting, etc. When the user is done editing, the application stores the modified source code in the custom tag.

Custom tags is a powerful feature enabling the application developer to enrich documents semantically by logical entities of his choice. More detailed information about how to use custom tags can be found in the FAQ. Our support also offers assistance in implementing custom tags in applications using HTMLEdit.

SmartTags

The “SmartTags” feature allows the application to recognize certain types of text (e.g. misspelled words, e-mail addresses, URLs, etc.) and enables the user to interact with that text (e.g. correct a misspelled word, write an e-mail, convert a URL into a hyperlink, etc.) The application developer decides which SmartTags (if any) should be recognized. There are a number of existing SmartTag handlers but because of the flexible SmartTag architecture the developer can also implement his own SmartTags.

A “SmartTag handler” recognizes a certain type of text in the document being edited. The text is provided to the SmartTag handler (which is a special class) by the component. The handler marks a part of the provided text as a SmartTag. HTMLEdit automatically underlines the recognized text with a zigzag line in order to indicate potential actions. If the user right-clicks on the SmartTag then the application can display a context menu or take some other action chosen by the developer.

SmartTags can be used for a variety of purposes but most commonly they are used in conjunction with spellchecking. The component has an appropriate handler that integrates with Addictive Software’s spellchecking components (which are not part of HTMLEdit). Details on how to activate the spellchecker can be found in the FAQ. More information about how to write custom SmartTag handlers can be obtained through our support.

Lists

HTMLEdit supports both ordered and unordered lists (lists with bullets and with numbers). Lists can be single-level or multi-level:

Image Alignments

HTMLEdit supports the display of images which can either be floated left or right in the text, or be placed centered in their own paragraph.

Image Dragging

Images can be visually repositioned via drag and drop...

Once you have selected an image you can resize it by clicking on a small resize-icon at the bottom of the image and drag it smaller or larger. Images can be shown transparently (alpha-blended) during moving and resizing. If your system does not support alpha-blending then during resizing a small frame which symbolizes the image is shown.

If images are too wide to fit the document, they will automatically be downsized, and a small overlay glyph will be displayed in the lower right corner to symbolize this:

 

Spell Checking

A word is underlined during editing to indicate that it is misspelled and can be dealt with in a context-menu. The component supports the Addict spell checking component (not contained in HtmlEdit).

 

Clipboard

Text can be copied, cut and pasted in HTML and standard-text form.

Document header

HtmlEdit supports document titles, provides easy access to meta-tags and can load and save style sheets contained in the document header.